let vm = new Vue({
    el: '#app',
    delimiters: ['[[', ']]'],
    data: {
       username: '',
       password: '',
       password2: '',
       mobile: '',
       allow: '',
       image_code: '',
       image_code_url: '',
       sms_code: '',
       uuid: '',
       count: -1,
       sms_code_tip: "获取验证码",
       error_image_code: false,
       error_allow: false,
       error_mobile: false,
       error_password2: false,
       error_password: false,
       error_name: false,
       error_sms_code: false,
       error_name_messages: '',
       error_mobile_messages: '',
       error_image_code_messages: '',
       error_sms_messages: '',
       username_is_exist: false,
       mobile_is_exist: false,
    },
    mounted(){
        this.generate_image_code();
    },
    methods: {
        check_sms_code(){
            let re = /^\d{6}$/;
            if (re.test(this.sms_code)){
                this.error_sms_code = false;
            }else{
                this.error_sms_code = true;
                this.error_sms_messages = 'Incorrect SMS code';
            }
        },
        get_sms_code(){
           this.check_methods();
           if(this.error_image_code == true ||  this.username_is_exist == true || this.mobile_is_exist == true || this.error_name == true || this.error_password == true || this.error_password2 == true || this.error_mobile == true || this.error_allow == true){
                    return;
           }
//            if(this.error_image_code == true ||  this.username_is_exist == true || this.error_name == true || this.error_password == true || this.error_password2 == true || this.error_allow == true){
//                    return;
//           }
            if(this.count != -1){
                return;
            }
            let url = '/smscode/' + this.mobile + '/?image_code='+ this.image_code + '&uuid=' + this.uuid;
            axios.get(url, {responseType: 'json'})
                .then(response => {
                    if (response.data.code == '0'){
                        this.count = 60;
                        let tid = setInterval(() => {
                            if(this.count == 0){
                                clearInterval(tid);
                                this.sms_code_tip = "获取验证码";
                                this.generate_image_code();
                                this.count = -1;
                                turn;
                            }
                            this.sms_code_tip = this.count + 's';
                            this.count -= 1;
                        }, 1000);
                    }else{
                        if (response.data.code == '4001'){
                            this.error_image_code = true;
                            this.error_image_code_messages = response.data.errmsg;
//                            this.generate_image_code();
                        }
                        else if(response.data.code == '4002'){
                            this.error_sms_code = true;
                            this.error_sms_messages = response.data.errmsg;
                        }
                    }
                })
                .catch(error => {

                })
        },
        check_username(){
            let re = /^[0-9a-zA-Z_-]{5,20}$/;
            if (re.test(this.username)){
                this.error_name = false;
            } else{
                this.error_name = true;
                this.error_name_messages = 'User name needs 5 to 20 characters!';
            }

            if(this.error_name == false){
                axios.get('/username/' + this.username +'/count', {
                    responseType: 'json'
                })
                .then(response => {
                    if(response.data.count == 1){
                        this.username_is_exist = true;
                        this.error_name = true;
                        this.error_name_messages = 'The user name is exist';
                    }else{
                        this.username_is_exist = false;
                    }
                })
                .catch(error => {
                    console.log(error.response);
                })
            }
        },
        check_password(){
            let re = /^[a-zA-Z0-9]{8,20}$/;
            if (re.test(this.password)){
                this.error_password = false;
            }else{
                this.error_password = true;
            }
        },
        check_password2(){
            if(this.password != this.password2){
                this.error_password2 = true;
            }else{
                this.error_password2 = false;
            }
        },
        check_mobile(){
            let re = /^1[3-9]\d{9}$/
            if(re.test(this.mobile)){
                this.error_mobile = false;
            }else{
                this.error_mobile = true;
                this.error_mobile_messages = 'Incorrect phone number format!'
            }

            if(this.error_mobile == false){
                axios.get('/mobile/' + this.mobile +'/count', {
                    responseType: 'json'
                })
                .then(response => {
                    if(response.data.count == 1){
                        this.mobile_is_exist = true;
                        this.error_mobile = true;
                        this.error_mobile_messages = 'The phone number is exist';
                    }else{
                        this.mobile_is_exist = false;
                    }
                })
                .catch(error => {
                    console.log(error.response);
                })
            }

        },
        check_allow(){
            if(!this.allow){
                this.error_allow = true;
            }else{
                this.error_allow = false;
            }
        },
        check_methods(){
           this.check_username();
           this.check_password();
           this.check_password2();
           this.check_mobile();
           this.check_image_code();
           this.check_allow();
        },
        on_submit(){
           this.check_methods();
           this.check_sms_code();
           if(this.error_image_code == true || this.error_sms_code == true || this.username_is_exist == true || this.mobile_is_exist == true || this.error_name == true || this.error_password == true || this.error_password2 == true || this.error_mobile == true || this.error_allow == true){
                    window.event.returnValue = false;
           }
        },
        generate_image_code(){
            this.uuid = generateUUID();
            this.image_code_url = '/verification_code/' + this.uuid +'/';
        },
        check_image_code(){
            if(this.image_code.length != 4){
                this.error_image_code = true;
                this.error_image_code_messages = 'Incorrect image code';
            }else{
                this.error_image_code = false;
            }
        },
    },
})